<template>
  <div class="wrapper">
    <div class="wrapper-top-info">
      <div class="info">Test药师，今天是{{ this.getDates(0) }}，欢迎您登录药学监护系统</div>
      <el-button v-if="!isShowNodept" class="setbtn" size="mini" type="primary" @click="getDeptList()">设置监护科室</el-button>
    </div>

    <div v-if="isShowNodept" class="wrapper-top-nodept">
      <div class="no-dept">
        <div class="no-dept-left">
          <i class="el-icon-warning" />
        </div>
        <div class="no-dept-right">
          <div class="title">检测到您未设置监护科室，请尽快</div>
          <el-button class="setbtn" size="mini" type="primary" @click="getDeptList()">设置监护科室</el-button>
        </div>
      </div>
    </div>
    <div v-else class="wrapper-top-dept">
      <div class="have-dept">
        <el-button icon="el-icon-arrow-left" class="change-scrollbar" type="info" @click="clickArrowLeft" />
        <el-scrollbar ref="elbar" style="width:1300px;height:150px">
          <div class="card-list">
            <template v-for="(item,index) in cardInfo">
              <el-card
                :key="item.deptcode"
                shadow="hover"
                class="card-info-item"
                @click.native="btnshowDetail(item,'first',null)"
              >
                <div class="closeIcon"><a class="el-icon-error" @click.stop="closeItem(item)" /></div>
                <div class="card-info">
                  <div class="info-deptname">
                    <div>{{ item.deptname }}</div>
                  </div>
                  <div class="info-number">
                    <div class="info-inpnum">
                      <div class="number-title">在院:{{ item.inpnum }}</div>
                      <div class="number-data" />
                    </div>
                    <div class="info-dischargednum">
                      <div class="number-title">待出院:{{ item.dischargednum }}</div>
                      <div class="number-data" />
                    </div>
                    <div class="info-newadmissionnum">
                      <div class="number-title">新入院:{{ item.newadmissionnum }}</div>
                      <div class="number-data" />
                    </div>
                  </div>
                  <div class="info-time">
                    <a
                      :class="item.activeDate === 0 ?'active':'' "
                      @click.stop="changeDateIndex(0,item.deptcode,2,item)"
                    >今日</a>
                    <a
                      :class="item.activeDate === -1 ?'active':'' "
                      @click.stop="changeDateIndex(-1,item.deptcode,2,item)"
                    >昨日</a>
                    <a
                      :class="item.activeDate === -2 ?'active':'' "
                      @click.stop="changeDateIndex(-2,item.deptcode,2,item)"
                    >前天</a>
                  </div>
                </div>
              </el-card>
            </template>
          </div>
        </el-scrollbar>
        <el-button icon="el-icon-arrow-right" class="change-scrollbar" type="info" @click="clickArrowRight" />
      </div>
    </div>

    <div class="wrapper-bottom">
      <el-tabs
        v-model="activeName"
        type="border-card"
        tab-position="left"
        class="bottom-tabs"
      >
        <el-tab-pane label="医嘱动态" name="first">
          <div class="orderslist-top">
            <div class="orders-title">
              <span>{{ selectCard.deptname }}</span>
              <span>近期医嘱动态</span>
            </div>
            <div class="orders-date">
              <a
                :class="indexOrdersDate === '0' ?'active':'' "
                @click="showDetail(selectCard,'change','0')"
              >今日</a>
              <a
                :class="indexOrdersDate === '-1' ?'active':'' "
                @click="showDetail(selectCard,'change','-1')"
              >昨日</a>
              <a
                :class="indexOrdersDate === '-2' ?'active':'' "
                @click="showDetail(selectCard,'change','-2')"
              >前天</a>
            </div>
            <div class="order-set">
              <a @click="showDrugList"> <i class="el-icon-document" /></a>
            </div>
          </div>
          <div class="orderslist-bottom">
            <Bluetable
              ref="blueTable"
              :t-head="indexOrdersListHead"
              :t-data="indexOrdersList"
              @operateClick="deleteClick"
            />
            <pagination
              :total="queryIndexOrdersList.total"
              :page.sync="queryIndexOrdersList.pagenum"
              :limit.sync="queryIndexOrdersList.pagesize"
              @pagination="getListOrdersList"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="监护计划" name="second">
          <el-table
            max-height="400"
            :data="guardianshipPlandata"
            row-key="id"
            border
            :tree-props="{children: 'children'}"
          >
            <el-table-column
              prop="startdate"
              label="开始时间"
              width="200"
            />
            <el-table-column
              prop="createuser"
              label="创建人"
              width="180"
            />
            <el-table-column
              prop="guardianshipobject"
              label="监护对象"
            />
            <el-table-column
              prop="guardianshippoints"
              label="监护要点"
            />
            <el-table-column
              prop="num"
              label="监护次数"
            />
            <el-table-column
              prop="enddate"
              label="结束时间"
            />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="用药建议" name="third">
          <el-scrollbar ref="elbar" style="width:100%;height:400px">
            <Bluetable
              ref="blueTable"
              :t-head="medicationSuggestiondataTitle"
              :t-data="medicationSuggestiondata"
            />
          </el-scrollbar>
        </el-tab-pane>
        <el-tab-pane label="提醒事项" name="fourth">
          <div class="wrapper-deptremind">
            <div class="deptremind-title">
              <a @click="getDeptReminddata('notHistory')"><div class="title-name">提醒事项</div></a>
              <a @click="getDeptReminddata('History')"><div class="title-name">查看历史</div></a>
            </div>
            <div class="deptremind-table">
              <el-scrollbar ref="elbar" style="width:100%;height:400px">
                <Bluetable
                  ref="blueTable"
                  :t-head="deptReminddataTitle"
                  :t-data="deptReminddata"
                  @operateClick="delSaveReminddata"
                />
              </el-scrollbar>
            </div>
          </div>
        </el-tab-pane>

      </el-tabs>
    </div>
    <!--    设置科室弹窗-->
    <el-dialog
      title="设置监护范围科室"
      :visible.sync="isShowSetGuardianshipDept"
      width="1150px"
      height="750px"
      @close="closeGetDeptList"
    >
      <div class="wrapper-deptlist">
        <div class="deptlist-letf">
          <div class="deptSearch">
            <el-input v-model="queryDeptInfo.keyword" placeholder="请输入内容" class="input-with-select">
              <el-button slot="append" icon="el-icon-search" @click="getDeptList" />
            </el-input>
          </div>
          <div class="left-table">
            <el-table
              ref="staffTable"
              height="400"
              :data="deptList"
              border
              fit
              highlight-current-row
              @selection-change="handleLeftChange"
            >
              <el-table-column type="selection" :reserve-selection="true" width="55" />
              <el-table-column label="科室代码" align="center">
                <template slot-scope="{row}">
                  <span>{{ row.deptcode }}</span>
                </template>
              </el-table-column>

              <el-table-column label="科室名称" align="center">
                <template slot-scope="{row}">
                  <span>{{ row.deptname }}</span>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <div class="left-page">
            <pagination :total="queryDeptInfo.total" :page.sync="queryDeptInfo.pagenum" :limit.sync="queryDeptInfo.pagesize" @pagination="getListDeptInfo" />
          </div>
        </div>
        <div class="deptlist-btns">
          <el-button
            type="primary"
            :disabled="!tempLeftList.length"
            icon="el-icon-arrow-right"
            size="mini"
            @click="addToRightList"
          />
          <el-button
            size="mini"
            type="primary"
            :disabled="!tempRightList.length"
            icon="el-icon-arrow-left"
            style="margin-left: 0;margin-top: 10px;"
            @click="delRightList"
          />
        </div>
        <div class="deptlist-right">
          <el-table
            ref="selectedStaffTable"
            :data="selectedDeptList"
            border
            fit
            height="400"
            highlight-current-row
            @selection-change="handleRigthChange"
          >

            <el-table-column type="selection" :reserve-selection="true" width="55" />
            <el-table-column label="科室代码" align="center">
              <template slot-scope="{row}">
                <span>{{ row.deptcode }}</span>
              </template>
            </el-table-column>

            <el-table-column label="科室名称" align="center">
              <template slot-scope="{row}">
                <span>{{ row.deptname }}</span>
              </template>
            </el-table-column>

          </el-table>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeGetDeptList">取 消</el-button>
        <el-button type="primary" @click="savegetDeptList">确 定</el-button>
      </span>
    </el-dialog>
    <!--    更改关注的药品-->
    <el-dialog
      title="更改关注的药品"
      :visible.sync="isShowSetDrugList"
      width="1150px"
      height="750px"
      @close="closeDrugList"
    >
      <div class="druglist-wrapper">
        <div class="druglist-top">
          <div class="druglist-top-left">
            <div class="druglist-top-left-item">
              <div class="left-item-title">医嘱类型</div>
              <div>
                <el-radio-group v-model="adviceType">
                  <el-radio :label="'2'">长期医嘱</el-radio>
                  <el-radio :label="'0'">仅长期医嘱</el-radio>
                  <el-radio :label="'1'">仅临时医嘱</el-radio>
                </el-radio-group>
              </div>
            </div>
            <div class="druglist-top-left-item">
              <div class="left-item-title">动态类型</div>
              <div>
                <el-radio-group v-model="dynamicType">
                  <el-radio :label="'1'">开停医嘱</el-radio>
                  <el-radio :label="'2'">仅新开医嘱</el-radio>
                  <el-radio :label="'3'">仅停止医嘱</el-radio>
                </el-radio-group>
              </div>
            </div>
          </div>
          <div class="druglist-top-right">
            <el-tag>已选药品复制到"监护图表-持续关注药品"</el-tag>
          </div>
        </div>
        <div class="druglist-search">
          <!--        <el-input v-model="queryDeptInfo.keyword" placeholder="请输入内容" class="input-with-select">-->
          <el-input v-model="drugListInfo.keyword" placeholder="请输入内容" class="input-with-select">
            <el-button slot="append" icon="el-icon-search" @click="serachDrugListInfo" />
          </el-input>
        </div>
        <div class="druglist-transfer">
          <el-transfer
            v-model="selectdrugListInfo"
            :data="drugListInfo.drugList"
            :titles="['药品信息','选中药品']"
          />
        </div>
        <div class="druglist-page">
          <pagination :total="drugListInfo.records" :page.sync="drugListInfo.pagenum" :limit.sync="drugListInfo.pagesize" @pagination="setDrugList" />
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeDrugList">取 消</el-button>
        <el-button type="primary" @click="saveDrugList">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { GetGuardianshipDeptJson,
  GetIndexPatientNum,
  GetDeptListJsonIndex,
  SaveGuardianshipDept,
  GetIndexOrdersList,
  GetDrugList,
  SaveDrugList,
  GetDeptReminddata,
  GetGuardianshipPlandata,
  GetMedicationSuggestiondata,
  SaveReminddata } from '@/api/cpw'
import { formatDate } from '../components/commonUtil'
export default {
  name: 'Index',
  filters: {
    formatDate(time) {
      var date = new Date(time)
      return formatDate(date, 'yyyy年MM月dd日')
    },
    formatDate2(time) {
      var date = new Date(time)
      return formatDate(date, 'yyyy/MM/dd')
    }
  },
  data() {
    return {
      tableData: [{
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-04',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-08',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-06',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-07',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }],
      // 用户id(测试数据)
      userid: '',
      username: '',
      today: this.getDates(0),
      yesterday: this.getDates(-1),
      beforeyesterday: this.getDates(-2),
      // today: '2019/01/21',
      // yesterday: '2019/01/20',
      // beforeyesterday: '2019/01/19',
      // 控制列表显示
      isShowNodept: true,
      // 当前用户设定的监护科室deptcode科室代码\deptname科室名称
      guardianshipDeptJson: [],
      // 获取设定的科室出院人数 待出院人数 新入院人数
      indexPatientNum: [],
      // 卡片信息
      cardInfo: [],
      showDetailInfo: {
        item: {},
        changeFlag: '',
        selectDate: ''
      },
      // 显示设置科室
      isShowSetGuardianshipDept: false,
      // 科室列表查询信息
      queryDeptInfo: {
        keyword: '',
        pagenum: 1,
        pagesize: 10,
        total: 0
      },
      // 获取的科室列表
      deptList: [],
      // 选中左侧列表
      tempLeftList: [],
      // 右侧数据
      selectedDeptList: [],
      // 选中右侧数据
      tempRightList: [],
      // 默认激活卡片
      activeName: 'first',
      // 医嘱列表
      indexOrdersList: [],
      // 查询医嘱信息
      queryIndexOrdersList: {
        Userid: this.userid,
        Date: '',
        Deptcode: '',
        pagesize: 10,
        pagenum: 1,
        total: 0
      },
      selectCard: {},
      // 医嘱动态时间激活
      indexOrdersDate: '0',
      indexOrdersListHead: [
        {
          operate: ['删除'],
          label: '操作',
          link: true
        },
        {
          prop: 'istemp',
          label: '医嘱类型',
          width: '50px'
        }, {
          prop: 'deptname',
          label: '科室名称'
        }, {
          prop: 'patient_name',
          label: '病人姓名'
        }, {
          prop: 'bedno',
          label: '床号'
        }, {
          prop: 'ordername',
          label: '药品名称'
        }, {
          prop: 'drugspec',
          label: '规格'
        }, {
          prop: 'singledose',
          label: '单次剂量'
        }, {
          prop: 'doseunit',
          label: '剂量单位'
        }, {
          prop: 'freq',
          label: '给药频次'
        }, {
          prop: 'routename',
          label: '给药途径'
        }, {
          prop: 'startdatetime',
          label: '医嘱开始时间'
        }, {
          prop: 'enddatetime',
          label: '医嘱结束时间'
        }
      ],
      // 更改关注的药品弹窗
      isShowSetDrugList: false,
      // 医嘱类型
      adviceType: '2',
      dynamicType: '1',
      // 药品信息列表
      drugListInfo: {
        drugList: [],
        records: 0,
        pagesize: 10,
        pagenum: 1,
        keyword: ''
      },
      // 选中药品信息列表
      selectdrugListInfo: [],
      // 保存关注的药品信息
      saveDrugListInfo: {
        UniquecodeList: []
      },
      // 提醒事项数据
      deptReminddata: [],
      // 提醒事项表头
      deptReminddataTitle: [
        {
          operate: ['不再提醒'],
          label: '操作',
          link: true,
          width: '100px'
        }, {
          prop: 'deptname',
          label: '科室名称'
        }, {
          prop: 'patient_name',
          label: '病人姓名'
        }, {
          prop: 'bedno',
          label: '床号'
        }, {
          prop: 'remindtxt',
          label: '提醒内容'
        }, {
          prop: 'reminddate',
          label: '提醒时间'
        }
      ],
      // 监护计划
      guardianshipPlandata: [],
      // 监护计划表头
      guardianshipPlandataTitle: [
        {
          prop: 'startdate',
          label: '开始时间'
        }, {
          prop: 'createuser',
          label: '创建人'
        }, {
          prop: 'guardianshipobject',
          label: '监护对象'
        }, {
          prop: 'guardianshippoints',
          label: '监护要点'
        }, {
          prop: 'num',
          label: '监护次数'
        }, {
          prop: 'enddate',
          label: '结束时间'
        }
      ],
      // 用药建议
      medicationSuggestiondata: [],
      medicationSuggestiondataTitle: [
        {
          prop: 'recordingdate',
          label: '记录时间',
          width: '90px'
        }, {
          prop: 'createuser',
          label: '创建人'
        }, {
          prop: 'suggestionobject',
          label: '建议对象'
        }, {
          prop: 'suggestionpoints',
          label: '建议内容'
        }, {
          prop: 'suggestiontype',
          label: '建议类型'
        }, {
          prop: 'suggestiondoctor',
          label: '建议接受医生'
        }, {
          prop: 'sendingstate',
          label: '是否发送状态'
        }, {
          prop: 'pharmacistreply',
          label: '药师回复'
        }, {
          prop: 'patient_id',
          label: '病人id'
        }, {
          prop: 'visit_id',
          label: '住院次数'
        }, {
          prop: 'deptcode',
          label: '科室代码'
        }, {
          prop: 'deptname',
          label: '科室名称'
        }, {
          prop: 'doctorcode',
          label: '医生代码'
        }
      ]
    }
  },
  watch: {
    guardianshipDeptJson(val) {
      if (val.length > 0) {
        this.isShowNodept = false
      }
    },
    indexPatientNum(value) {
      if (value.length > 0) {
        this.cardInfo.forEach(value => {
          this.indexPatientNum.forEach(value1 => {
            if (value.deptcode === value1.deptcode) {
              value.inpnum = value1.inpnum
              value.dischargednum = value1.dischargednum
              value.newadmissionnum = value1.newadmissionnum
            }
          })
        })
      }
    }
  },
  mounted() {
    const userInfo = localStorage.getItem('user')
    this.username = JSON.parse(userInfo).real_name
    this.userid = JSON.parse(userInfo).user_no
  },
  activated() {
    const userInfo = localStorage.getItem('user')
    this.username = JSON.parse(userInfo).real_name
    this.userid = JSON.parse(userInfo).user_no
  },
  created() {
    const userInfo = localStorage.getItem('user')
    this.username = JSON.parse(userInfo).real_name
    this.userid = JSON.parse(userInfo).user_no
    // 获取当前用户设定的监护科室
    this.getGuardianshipDeptJson()
  },
  methods: {
    // 显示弹窗
    showDrugList() {
      this.isShowSetDrugList = true
      this.getDrugList()
    },
    closeDrugList() {
      this.isShowSetDrugList = false
      this.drugListInfo = {
        drugList: [],
        records: 0,
        pagesize: 10,
        pagenum: 1,
        keyword: ''
      }
    },
    async deleteClick(val, row) {
      await SaveDrugList({
        json: {
          Userid: this.userid,
          UserName: this.username,
          UniquecodeList: [
            {
              Deptcode: row.deptcode,
              Deptname: row.deptname,
              Uniquecode: row.uniquecode,
              Drugname: row.ordername,
              Type: '',
              DynamicType: '',
              Status: '0'
            }
          ]
        }
      }).then(res => {
        if (res === '保存成功') {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        } else {
          this.$message({
            message: '失败',
            type: 'warning'
          })
        }
      }).catch(err => {
        console.log(err)
      })
      location.reload()
    },
    async saveDrugList() {
      this.isShowSetDrugList = false
      this.saveDrugListInfo.UniquecodeList = []
      // 通过uniquecode获取drugname
      for (let i = 0; i < this.selectdrugListInfo.length; i++) {
        const uniquecode = this.selectdrugListInfo[i]
        for (let j = 0; j < this.drugListInfo.drugList.length; j++) {
          if (uniquecode === this.drugListInfo.drugList[j].key) {
            const drugname = this.drugListInfo.drugList[j].label
            this.saveDrugListInfo.UniquecodeList.push({
              Deptcode: this.showDetailInfo.item.deptcode,
              Deptname: this.showDetailInfo.item.deptname,
              Uniquecode: uniquecode,
              Drugname: drugname,
              Type: this.adviceType,
              DynamicType: this.dynamicType,
              Status: '1'
            })
            break
          }
        }
      }
      this.saveDrugListInfo.Userid = this.userid
      this.saveDrugListInfo.UserName = this.username
      await SaveDrugList({
        json: {
          Userid: this.saveDrugListInfo.Userid,
          UserName: this.saveDrugListInfo.UserName,
          UniquecodeList: this.saveDrugListInfo.UniquecodeList
        }
      }).then(res => {
        if (res === '保存成功') {
          this.$message({
            message: '保存成功',
            type: 'success'
          })
        } else {
          this.$message({
            message: '保存失败',
            type: 'warning'
          })
        }
      }).catch(err => {
        console.log(err)
      })
      location.reload()
      this.showDetail(this.item, this.changeFlag, this.selectDate)
    },
    // 获取药品信息
    async getDrugList() {
      this.drugListInfo.drugList = []
      await GetDrugList({
        keyword: this.drugListInfo.keyword,
        pagesize: this.drugListInfo.pagesize + '',
        pagenum: this.drugListInfo.pagenum + ''
      }).then(res => {
        for (let i = 0; i < res.rows.length; i++) {
          this.drugListInfo.drugList.push({
            key: res.rows[i].uniquecode,
            label: res.rows[i].drugname
          })
        }
        this.drugListInfo.records = res.records
      }).catch(err => {
        console.log(err)
      })
    },
    // 搜索
    async serachDrugListInfo() {
      await this.getDrugList()
    },
    // 药品信息分页
    // 药品信息分页
    async setDrugList(type) {
      this.drugListInfo.pagenum = type.page
      this.drugListInfo.pagesize = type.limit
      await this.getDrugList()
    },
    // 获取当前用户设定的监护科室
    async getGuardianshipDeptJson() {
      await GetGuardianshipDeptJson({
        userid: this.userid
      }).then(res => {
        this.guardianshipDeptJson = []
        this.indexPatientNum = []
        res.forEach((val) => {
          this.guardianshipDeptJson.push(val)
          var temp = {
            deptcode: val.deptcode,
            deptname: val.deptname,
            inpnum: 0,
            dischargednum: 0,
            newadmissionnum: 0,
            activeDate: 0
          }
          this.cardInfo.push(temp)
          this.getIndexPatientNum(this.userid, this.today, val.deptcode, 1)
        })
      }).catch(err => {
        console.log(err)
      })
    },
    // 获取设定的科室出院人数 待出院人数 新入院人数
    async getIndexPatientNum(Userid, Date, DeptCode, flag) {
      await GetIndexPatientNum({
        json: {
          Userid: Userid,
          Date: Date,
          DeptCode: DeptCode
        }
      }).then(res => {
        var temp = {
          deptcode: DeptCode,
          inpnum: res[0].inpnum === null ? 0 : res[0].inpnum,
          dischargednum: res[0].dischargednum === null ? 0 : res[0].dischargednum,
          newadmissionnum: res[0].newadmissionnum === null ? 0 : res[0].newadmissionnum
        }
        if (flag === 1) {
          this.indexPatientNum.push(temp)
        } else {
          this.cardInfo.forEach(value => {
            if (value.deptcode === temp.deptcode) {
              value.inpnum = temp.inpnum
              value.dischargednum = temp.dischargednum
              value.newadmissionnum = temp.newadmissionnum
            }
          })
        }
      }).catch(err => {
        console.log(err)
      })
    },
    // 修改当前获取的日期人数
    changeDateIndex(dateFlag, DeptCode, flag, item) {
      if (dateFlag === 0) {
        item.activeDate = 0
        this.getIndexPatientNum(this.userid, this.today, DeptCode, flag)
      } else if (dateFlag === -1) {
        item.activeDate = -1
        this.getIndexPatientNum(this.userid, this.yesterday, DeptCode, flag)
      } else if (dateFlag === -2) {
        item.activeDate = -2
        this.getIndexPatientNum(this.userid, this.beforeyesterday, DeptCode, flag)
      }
    },
    // 设置监护科室
    async getDeptList() {
      await GetDeptListJsonIndex({
        pagenum: this.queryDeptInfo.pagenum,
        pagesize: this.queryDeptInfo.pagesize,
        keyword: this.queryDeptInfo.keyword
      }).then(res => {
        this.deptList = res.rows
        this.queryDeptInfo.total = res.records
      }).catch(err => {
        console.log(err)
      })
      this.isShowSetGuardianshipDept = true
    },
    // 保存弹窗
    async savegetDeptList() {
      const temp = []
      this.selectedDeptList.forEach(item => {
        const obj = {
          Deptcode: item.deptcode,
          Deptname: item.deptname,
          Status: '1'
        }
        temp.push(obj)
      })
      this.isShowNodept = false
      await SaveGuardianshipDept({
        json: {
          Userid: this.userid,
          UserName: this.username,
          DeptcodeList: temp
        }
      }).then(res => {
        if (res === '监护科室设置成功') {
          this.$message({
            message: '保存成功',
            type: 'success'
          })
        } else {
          this.$message({
            message: '保存失败',
            type: 'warning'
          })
        }
      }).catch(err => {
        console.log(err)
      })
      this.closeGetDeptList()
      location.reload()
    },
    // 关闭弹窗
    closeGetDeptList() {
      this.isShowSetGuardianshipDept = false
      this.deptList = []
      this.tempLeftList = []
      this.selectedDeptList = []
      this.tempRightList = []
      this.$refs.staffTable.clearSelection()
    },
    // 设置分页
    async getListDeptInfo(type) {
      this.queryDeptInfo.pagenum = type.page
      this.queryDeptInfo.pagesize = type.limit
      await this.getDeptList()
    },
    async getListOrdersList(type) {
      this.queryIndexOrdersList.pagenum = type.page
      this.queryIndexOrdersList.pagesize = type.limit
      await this.showDetail(this.selectCard)
    },
    // 将左边表格选择项存入deptcodeList中
    handleLeftChange(rows) {
      this.tempLeftList = []
      if (rows) {
        rows.forEach(row => {
          if (row) {
            this.tempLeftList.push(row)
          }
        })
      }
      this.tempLeftList = [...new Set(this.tempLeftList)]
    },
    handleRigthChange(rows) {
      this.tempRightList = []
      if (rows) {
        rows.forEach(row => {
          if (row) {
            this.tempRightList.push(row)
          }
        })
      }
      this.tempRightList = [...new Set(this.tempRightList)]
    },
    // 左边表格选择项移到右边
    addToRightList() {
      this.tempLeftList = [...new Set(this.tempLeftList)]
      this.tempLeftList.forEach(item => {
        this.selectedDeptList.push(item)
      })
      this.selectedDeptList = [...new Set(this.selectedDeptList)]
      this.tempLeftList = []
    },
    // 删除右侧数据
    delRightList() {
      for (var i = 0; i < this.selectedDeptList.length; i++) {
        for (var j = 0; j < this.tempRightList.length; j++) {
          if (this.selectedDeptList[i].deptcode === this.tempRightList[j].deptcode) {
            this.selectedDeptList.splice(i, 1)
            this.tempRightList.splice(j, 1)
            i--
            break
          }
        }
      }
    },
    // 删除
    async closeItem(item) {
      const temp = []
      const obj = {
        Deptcode: item.deptcode,
        Deptname: item.deptname,
        Status: '0'
      }
      temp.push(obj)
      const tempJson = {
        Userid: this.userid,
        UserName: this.username,
        DeptcodeList: temp
      }
      await SaveGuardianshipDept({
        json: tempJson
      }).then(res => {
        if (res === '监护科室设置成功') {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        } else {
          this.$message({
            message: '删除失败',
            type: 'warning'
          })
        }
      }).catch(err => {
        console.log(err)
      })
      location.reload()
    },
    // 点击左右按钮，控制scrollLeft
    clickArrowLeft() {
      const scrollLeft = this.$refs['elbar'].wrap.scrollLeft
      this.$refs['elbar'].wrap.scrollLeft = scrollLeft - 200
    },
    clickArrowRight() {
      const scrollLeft = this.$refs['elbar'].wrap.scrollLeft
      this.$refs['elbar'].wrap.scrollLeft = scrollLeft + 200
    },
    // 0代表今日,-1代表昨日, -2前天
    getDates(dates) {
      var dd = new Date()
      var n = dates || 0
      dd.setDate(dd.getDate() + n)
      var y = dd.getFullYear()
      var m = dd.getMonth() + 1
      var d = dd.getDate()
      m = m < 10 ? '0' + m : m
      d = d < 10 ? '0' + d : d
      var day = y + '/' + m + '/' + d
      return day
    },
    // 显示详细信息
    btnshowDetail(item) {
      this.showDetail(item, 'first', null)
    },
    async showDetail(item, changeFlag, selectDate) {
      this.showDetailInfo.item = item
      this.showDetailInfo.changeFlag = changeFlag
      this.showDetailInfo.selectDate = selectDate
      if (changeFlag === 'first') {
        this.selectCard = item
        this.queryIndexOrdersList.Date = this.today
      } else if (changeFlag === 'change') {
        if (selectDate === '0') {
          this.indexOrdersDate = '0'
          this.queryIndexOrdersList.Date = this.today
        } else if (selectDate === '-1') {
          this.indexOrdersDate = '-1'
          this.queryIndexOrdersList.Date = this.yesterday
        } else if (selectDate === '-2') {
          this.indexOrdersDate = '-2'
          this.queryIndexOrdersList.Date = this.beforeyesterday
        }
      }
      this.queryIndexOrdersList.Deptcode = item.deptcode
      await GetIndexOrdersList({
        json: {
          Userid: this.userid,
          Date: this.queryIndexOrdersList.Date,
          Deptcode: this.queryIndexOrdersList.Deptcode
        },
        pagesize: this.queryIndexOrdersList.pagesize,
        pagenum: this.queryIndexOrdersList.pagenum
      }).then(res => {
        this.indexOrdersList = res.rows
        this.queryIndexOrdersList.total = res.records
      }).catch(err => {
        console.log(err)
      })
      this.getDeptReminddata('notHistory')
      this.getGuardianshipPlandata()
      this.getMedicationSuggestiondata()
    },
    // 获取提醒事项/历史提醒事项
    async getDeptReminddata(flag) {
      var tempJson = {}
      if (flag === 'notHistory') {
        tempJson = {
          Userid: this.userid,
          Deptcode: this.queryIndexOrdersList.Deptcode
        }
      } else if (flag === 'History') {
        tempJson = {
          Userid: this.userid,
          Deptcode: this.queryIndexOrdersList.Deptcode, History: '1'
        }
      }
      await GetDeptReminddata({
        json: tempJson
      }).then(res => {
        this.deptReminddata = res.GuardianshipPlandata
      }).catch(err => {
        console.log(err)
      })
    },
    // 获取科室监护计划
    async getGuardianshipPlandata() {
      var tempJson = {
        Userid: this.userid,
        Deptcode: this.queryIndexOrdersList.Deptcode
      }
      this.guardianshipPlandata = []
      await GetGuardianshipPlandata({
        json: tempJson
      }).then(res => {
        const guardianshipPlandataTemp = []
        for (let i = 0; i < res.GuardianshipPlandata.length; i++) {
          const item = res.GuardianshipPlandata[i]
          if (item.patient_node === null) {
            item.children = []
            guardianshipPlandataTemp.push(item)
          } else {
            for (var index in item) {
              if (index === 'patient_node') {
                for (let j = 0; j < guardianshipPlandataTemp.length; j++) {
                  if (item[index] === guardianshipPlandataTemp[j].id) {
                    guardianshipPlandataTemp[j].children.push(item)
                  }
                }
              }
            }
          }
        }
        this.guardianshipPlandata = guardianshipPlandataTemp
      }).catch(err => {
        console.log(err)
      })
    },
    // 获取科室用药建议
    async getMedicationSuggestiondata() {
      this.medicationSuggestiondata = []
      const tempJson = {
        Userid: this.userid,
        Deptcode: this.queryIndexOrdersList.Deptcode
      }
      await GetMedicationSuggestiondata({
        json: tempJson
      }).then(res => {
        this.medicationSuggestiondata = res.GuardianshipPlandata
      }).catch(err => {
        console.log(err)
      })
    },
    // 删除提醒事项
    async delSaveReminddata(val, row) {
      const tempJson = {
        Id: row.id,
        RemindDate: row.reminddate,
        RemindTxt: row.remindtxt,
        Status: '0'
      }
      await SaveReminddata({
        json: tempJson
      }).then(res => {
        if (res === '保存成功') {
          this.$message({
            message: '操作成功',
            type: 'success'
          })
        }
        this.getDeptReminddata('notHistory')
      }).catch(err => {
        console.log(err)
      })
    }
  }
  // 删除提醒事项

}
</script>

<style scoped lang="scss">
  .wrapper{
    padding: 20px;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    .wrapper-top-info{
      background-color: #FFFFFF;
      width: 100%;
      height: 30px;
      border-radius: 10px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 14px;
      .info{
        margin-left: 50px;
      }
    }
    .wrapper-top-nodept{
      margin-top: 20px;
      background-color: #FFFFFF;
      width: 100%;
      height: 150px;
      border-radius: 10px;
      display: flex;
      justify-content: center;
      align-items: center;
      .no-dept{
        display: flex;
        align-items:center;
        justify-content:center;
        .no-dept-left{
          font-size: 36px;
          width: 40px;
        }
        .no-dept-right {
          font-size: 18px;
          display: flex;
          flex-direction: column;
          align-items: center;
          padding-right: 50px;
          .title{
            padding-bottom: 5px;
          }
        }
      }
    }
    .wrapper-top-dept{
      margin-top: 20px;
      background-color: #FFFFFF;
      width: 100%;
      height: 150px;
      border-radius: 10px;
      .have-dept{
        display: flex;
        justify-content: center;
        align-items: center;
        .change-scrollbar{
          width: 30px;
          height: 65px;
          margin: 15px;
          font-size: 20px;
          background:#28a4f4;
          border: 0;
          padding: 0;
          display: flex;
          justify-content: center;
          align-items: center;
        }
        .card-list{
          display: flex;
          .card-info-item{
            flex: 0 0 200px;
            width: 200px;
            height: 120px;
            margin: 15px;
            border-radius: 10px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            .closeIcon{
              font-size: 16px;
              text-align: right;
              z-index: 2;
              margin-top: -15px;
              padding-right: 5px;
            }
            .card-info {
              display: flex;
              flex-direction: column;
              align-content: space-around;
              justify-content: space-around;
              .info-deptname{
                font-size: 16px;
                color: #2f90fd;
                text-align: center;
              }
              .info-number{
                display: flex;
                justify-content: space-around;
                font-size: 14px;
                padding: 10px 0;
              }
              .info-time{
                font-size: 14px;
                display: flex;
                justify-content: space-around;
              }
            }
          }
        }
      }
    }
    .wrapper-bottom{
      width: 100%;
      margin-top: 20px;
      border-radius: 10px;
      .bottom-tabs{
        height: 400px;
        .orderslist-top{
          display: flex;
          font-size: 14px;
          .orders-title{
            border-left: 2px solid #2f90fd;
            padding:0 25px;
          }
          .orders-date{
            width: 150px;
            display: flex;
            justify-content:space-between;
          }
          .order-set {
            font-size: 14px;
            margin-left: 20px;
          }
        }
        .orderslist-bottom{
          margin-top: 20px;
          }
        }
      }
    .wrapper-deptlist{
      display: flex;
      .deptlist-letf{
        width: 500px;
        height: 500px;
        display: flex;
        flex-direction: column;
        .left-table{
          width: 100%;
          height: 500px;
          margin-top: 10px;
        }
        .left-page{
          width: 100%;
        }
      }
      .deptlist-btns{
        width: 100px;
        padding: 10px;
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .deptlist-right{
        width: 500px;
        height: 500px;
      }
    }
    .druglist-wrapper{
      display: flex;
      flex-direction: column;
      margin-left: 10px;
      .druglist-top{
        display: flex;
        align-items: center;
        .druglist-top-left-item{
          display: flex;
          padding-bottom: 5px;
          .left-item-title{
            padding-right: 10px;
          }
        }
        .druglist-top-right{
          margin-left: 120px;
        }
      }
      .druglist-search{
        margin-top: 10px;
        width: 420px;
      }
      .druglist-transfer{
        margin-top: 10px;
      }
      .druglist-page{
        display: flex;
      }
    }
    .wrapper-deptremind{
      .deptremind-title{
        display: flex;
        border-left: 2px solid #2f90fd;
        font-size: 16px;
        .title-name{
          width: 80px;
          padding-left: 10px;
        }
      }
      .deptremind-table{
        margin-top: 20px;
      }
    }
  }
  .active {
    color:#28a4f4
  }
  // 滚动条
  /deep/.el-scrollbar__wrap {
    overflow-x: hidden;
  }
  // 卡片
  /deep/.el-card__body{
    padding: 0;
    margin-top: 0;
  }
  /deep/.el-transfer-panel{
    width: 420px;
    height: 380px;
  }
  /deep/.el-transfer-panel__list{
    height: 500px;
  }
  /deep/.el-table th{
    background:#409efe;color:#fff;font-size:12px;height:36px;padding:0;line-height:36px;text-align:center;border:0;
  }
  /deep/.el-table .cell{
    text-align: center;
    font-size:12px;
  }
</style>
